//主要边框颜色
$-color-border: #E5E5E5;

//黑色
$-color-black: #101010;

//白色
$-color-white: #ffffff;

//字体主色
$-color-normal: #333333;

//字体浅色
$-color-lighter: #666666;

//字体更浅色
$-color-muted: #999999;

//主题色
$-color-main: #3091FB;

//背景色
$-color-body: #F6F6F6;

/** S Font's size **/
$-font-size-xxs: 22rpx;
$-font-size-xs: 24rpx;
$-font-size-sm: 26rpx;
$-font-size-nr: 28rpx;
$-font-size-md: 30rpx;
$-font-size-lg: 32rpx;
$-font-size-xl: 34rpx;
$-font-size-xxl: 36rpx;
/** E Font's size **/

//边框
$-solid-border: 1px solid $-color-border;
$-dashed-border: 1px dashed $-color-border;
$-dotted-border: 1px dotted $-color-border;

.bor_b {
	border-bottom: 2rpx solid #000000;
}


html {
	background-color: #F6F6F6;
}

.center{
	text-align: center;
}

view {
	box-sizing: border-box;
	text-align: left;
}

page {
	/* 定义一些主题色及基础样式 */
	font-family: PingFang SC, Arial, Hiragino Sans GB, Microsoft YaHei, sans-serif;
	font-size: 28rpx;
	color: $-color-normal;
	padding-bottom: env(safe-area-inset-bottom);
	background-color: $-color-body;
}

//宽度
.w100 {
	width: 100%;
}


.bold {
	font-weight: bold;
}

/* 定义字体颜色 */
.black {
	color: $-color-black;
}

.white {
	color: $-color-white;
}

.normal {
	color: $-color-normal;
}

.lighter {
	color: $-color-lighter;
}

.muted {
	color: $-color-muted;
}

.invite_code {
	color: #F77009;
}

.gray {
	color: #9B9B9B;
}

.font_gray{
	color: #949494;
}

.font_price{
	color: #F23C24;
}

.status_success{
	color: #3091FB;
}

.status_green{
	color: #44CF59;
}
.status_red{
	color: #FF3A30;
}
.status_warn{
	color:#F9AE3D;
	// color:#E0A04C;
}

/* 定义背景颜色 */
.bg-white {
	background-color: $-color-white;
}

.bg-body {
	background-color: $-color-body;
}

.bg-gray {
	background-color: $-color-border;
}


.bg-main {
	background-color: $-color-main;
}




/* 定义字体大小 */

.xxl {
	font-size: $-font-size-xxl;
}

.xl {
	font-size: $-font-size-xl;
}

.lg {
	font-size: $-font-size-lg;
}

.md {
	font-size: $-font-size-md;
}

.nr {
	font-size: $-font-size-nr;
}

.sm {
	font-size: $-font-size-sm;
}

.xs {
	font-size: $-font-size-xs;
}

.xxs {
	font-size: $-font-size-xxs;
}

.f_20{
	font-size: 20rpx;
}

.f_24 {
	font-size: 24rpx;
}

.f_26 {
	font-size: 26rpx;
}

.f_40 {
	font-size: 40rpx;
}
.f_60 {
	font-size: 60rpx;
}
// 定义内外边距，历遍1-80
@for $i from 0 through 60 {

	// 只要双数和能被5除尽的数
	@if $i % 2==0 or $i % 5==0 {

		// 如：m-30
		.m-#{$i} {
			margin: $i + rpx;
		}

		// 如：p-30
		.p-#{$i} {
			padding: $i + rpx;
		}

		@each $short, $long in l left, t top, r right, b bottom {

			//结果如： m-l-30
			// 定义外边距
			.m-#{$short}-#{$i} {
				margin-#{$long}: $i + rpx;
			}

			// 定义内边距
			//结果如： p-l-30
			.p-#{$short}-#{$i} {
				padding-#{$long}: $i + rpx;
			}
		}
	}
}

.m_10{
	margin: 10rpx;
}
.m_l_10 {
	margin-left: 10rpx;
}

.m_l_20 {
	margin-left: 20rpx;
}

.m_l_30 {
	margin-left: 30rpx;
}

.m_l_24 {
	margin-left: 24rpx;
}

.m_l_60 {
	margin-left: 60rpx;
}

.m_l_100 {
	margin-left: 100rpx;
}
.m_r_10 {
	margin-right: 10rpx;
}

.m_r_20 {
	margin-right: 20rpx;
}

.m_r_24 {
	margin-right: 24rpx;
}

.m_r_96 {
	margin-right: 96rpx;
}

.m_t_10 {
	margin-top: 10rpx;
}

.m_t_20 {
	margin-top: 20rpx;
}

.m_24_0 {
	margin: 24rpx 0;
}

.m_t_30 {
	margin-top: 30rpx;
}

.m_t_32 {
	margin-top: 32rpx;
}

.m_t_48 {
	margin-top: 48rpx;
}

.m_t_60 {
	margin-top: 60rpx;
}
.m_t_100 {
	margin-top: 100rpx;
}
.m_b_20 {
	margin-bottom: 20rpx;
}

.m_b_24 {
	margin-bottom: 24rpx;
}

.m_b_32 {
	margin-bottom: 32rpx;
}

.m_b_30 {
	margin-bottom: 30rpx;
}

.p_10{
	padding: 10rpx;
}

.p_20 {
	padding: 20rpx;
}

.p_30 {
	padding: 30rpx;
}

.p_32 {
	padding: 32rpx;
}

.p_20_0{
	padding: 20rpx 0;
}

.p_20_32{
	padding: 20rpx 32rpx;
}

.p_30_0 {
	padding: 30rpx 0;
}

.p_40_20 {
	padding: 40rpx 20rpx;
}

.p_80_0{
	padding: 80rpx 0;
}

.p_0_20{
	padding: 0 20rpx;
}

.p_0_40 {
	padding: 0 40rpx;
}

.p_r_30 {
	padding-right: 30rpx;
}

.p_36_20 {
	padding: 36rpx 20rpx;
}

.p_30_20 {
	padding: 30rpx 20rpx;
}

.p_l_60 {
	padding-left: 60rpx;
}

.p_t_20{
	padding-top: 20rpx;
}

.p_b100{
	padding-bottom: 100rpx;
}

.p_b_180 {
	padding-bottom: 180rpx !important;
}

.inline {
	display: inline-block;
}

.flex {
	display: flex;
}

.flex-wrap {
	flex-wrap: wrap;
}

.flex-20{
	flex: 25%;
}

.flex-nowrap {
	flex-wrap: nowrap;
}

.col-baseline {
	align-items: baseline;
}

.col-center {
	align-items: center;
}

.col-top {
	align-items: flex-start;
}

.col-bottom {
	align-items: flex-end;
}

.col-stretch {
	align-items: stretch;
}

.col-between {
	align-content: space-between
}

.row-center {
	justify-content: center;
}

.row-left {
	justify-content: flex-start;
}

.row-right {
	justify-content: flex-end;
}

.row-between {
	justify-content: space-between;
}

.row-around {
	justify-content: space-around;
}

.text-left {
	text-align: left;
}

.text-center {
	text-align: center;
}

.text-right {
	text-align: right;
}

.flex-col {
	/* #ifndef APP-NVUE */
	display: flex;
	/* #endif */
	flex-direction: column;
}



.flex-none {
	flex: none;
}




/* 超出隐藏 */
/* start--文本行数限制--start */
.line-1 {
	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;
}

.line-2 {
	-webkit-line-clamp: 2;
}

.line-3 {
	-webkit-line-clamp: 3;
}

.line-2,
.line-3 {
	overflow: hidden;
	word-break: break-all;
	text-overflow: ellipsis;
	display: -webkit-box; // 弹性伸缩盒
	-webkit-box-orient: vertical; // 设置伸缩盒子元素排列方式
}

/* 中划线 */
.line-through {
	text-decoration: line-through;
}

.skuline {
	-webkit-line-clamp: 1;
	overflow: hidden;
	word-break: break-all;
	text-overflow: ellipsis;
	display: -webkit-box; // 弹性伸缩盒
	-webkit-box-orient: vertical; // 设置伸缩盒子元素排列方式
}

.skuline_none {
	overflow: hidden;
	word-break: break-all;
	text-overflow: ellipsis;
	display: -webkit-box; // 弹性伸缩盒
	-webkit-box-orient: vertical; // 设置伸缩盒子元素排列方式
}

/* br60 */
.br60 {
	border-radius: 60rpx;
}

.br12 {
	border-radius: 12rpx;
}

/* 初始化按钮 */
page button {
	margin: 0;
	background-color: transparent;
	font-weight: normal;
	font-size: 28rpx;
	overflow: unset;
	margin-left: 0;
	margin-right: 0;
	padding: 0 30rpx;
}

page button::after {
	border: none;
}

/* 按钮大小 */
button[size="xs"] {
	line-height: 58rpx;
	height: 58rpx;
	font-size: 26rpx;
}

button[size="sm"] {
	line-height: 62rpx;
	height: 62rpx;
	font-size: 28rpx;
}

button[size="md"] {
	line-height: 70rpx;
	height: 70rpx;
	font-size: 30rpx;
}

button[size="lg"] {
	line-height: 80rpx;
	height: 80rpx;
	font-size: 32rpx;
}


.img-null {
	width: 300rpx;
	height: 300rpx;
}

.u-image image {
	display: block;
}

/* 隐藏滚动条 */
::-webkit-scrollbar {
	width: 0;
	height: 0;
	color: transparent;
}

.scrollbar_none{
	height: 100vh;
	padding-bottom: 150rpx;
    overflow-y: auto;

     ::-webkit-scrollbar{
        display: none
    }
}

.btn_f {
	width: 100%;
	position: fixed;
	bottom: 0;
	left: 0;
}

// 阴影
.box_shadow {
	box-shadow: 0 0 10rpx 0 #0000001a;
}

// 双按钮  清空-确认
.btn{
	width: 100%;
	padding: 0 20rpx;
	position: fixed;
	bottom: 32rpx;
	left: 0;

	.close {
			margin-right: 40rpx;
			color: #898989;
			background-color: transparent;
			border: 2rpx solid #898989;
		}
}

// 背景渐变
// .view {
// 	height: 130px;
// 	background: linear-gradient(180deg, #E0A04C 0%, #F6F6F6 100%);
// }